<!--
 * @Author: CHINAKAIYUAN<sunkaiyuan@namenode.cn>
 * @Date: 2022-02-03 14:41:20
 * @LastEditTime: 2022-08-26 13:55:19
 * @LastEditors: CHINAKAIYUAN
 * @Description:   :gridOps="gridOptions" 
-->
<template>
  <el-container>
    <el-aside width="60%">
      <el-container>
        <el-header> <div>订阅明细</div> </el-header>
        <el-main class="nopadding">
          <sc-VxeTable
            :tablecode="'system_subscribe'"
            :url="this.$API.system.subscribe.list"
            :gridEvts="gridEvent"
            ref="grid"
          >
          </sc-VxeTable>
        </el-main>
      </el-container>
    </el-aside>
    <el-container>
      <el-header>
        <div>接口明细</div>
      </el-header>
      <el-main class="nopadding">
        <sc-VxeTable
          :tablecode="'system_subscribe_api'"
          :url="this.$API.system.subscribe.listApi"
          :params="params"
          :gridEvts="gridEventApi"
          ref="subbe"
        >
        </sc-VxeTable>
      </el-main>
    </el-container>
  </el-container>
  <save-dialog
    v-if="dialog"
    ref="saveDialog"
    @success="handleSuccess"
    @closed="dialog = false"
  ></save-dialog>
</template>

<script>
import saveDialog from "./save";

export default {
  name: "setting_subscribe",
  components: {
    saveDialog,
  },
  data() {
    return {
      dialog: false,
      params: null,
      subscribe_id: 0,
      gridEvent: {
        add: ({ code }) => {
          this.dialog = true;
          this.openSave(code);
        },
        edit: () => {
          let selects = this.$refs.grid.xGrid.getCheckboxRecords();
          if (selects.length == 0) {
            this.$message.error("必须选中元素");
            return;
          }
          this.edit(selects[0]);
        },
        cellDblclick: ({ row }) => {
          this.subscribe_id = row.id;
          this.params = { subscribe_id: this.subscribe_id };
          this.$nextTick(() => {
            this.$refs.subbe.refresh();
          });
          // this.edit(row);
        },
      },
      gridEventApi: {
        subscribe: (data) => {
          this.subscribeApi(data, "subscribe");
        },
        nosubscribe: (data) => {
          this.subscribeApi(data, "nosubscribe");
        },
      },
    };
  },
  methods: {
    edit(item) {
      let selected = {};
      this.dialog = true;
      // this.openSave();
      if (typeof item == "undefined") {
        selected = this.$refs.grid.xGrid.getCheckboxRecords()[0];
      } else selected = item;

      this.$nextTick(() => {
        this.$refs.saveDialog.open("edit").setData(selected);
      });
    },
    openSave() {
      this.$nextTick(() => {
        this.$refs.saveDialog.open();
      });
    },
    handleSuccess() {
      this.$refs.grid.refresh();
    },
    subscribeApi(data, name) {
      let ids = data.button.selectRecords.map((row) => {
        return row.id;
      });

      this.$API.system.subscribe[name]
        .get({
          subscribe_id: this.subscribe_id,
          ids: ids,
        })
        .then(() => {
          this.$refs.subbe.refresh();
        });
    },
  },
};
</script>
